<template>
    <div class="app-container notice">
        <el-table v-loading="loading" :data="tableList">
            <el-table-column label="标题" prop="noticeTitle"/>
            <el-table-column label="发布时间" prop="createTime"/>
            <el-table-column label="发布者" prop="createBy"/>
            <el-table-column label="操作" width="150" class-name="small-padding fixed-width">
                <template slot-scope="{row}">
                    <el-button size="mini" type="text" @click="onNoticeDetail(row)">查看内容</el-button>
                </template>
            </el-table-column>
        </el-table>
        <!--分页-->
        <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
                    @pagination="getList"/>

        <!--公告详情-->
        <el-drawer title="公告详情" :visible.sync="showNoticeDetail" size="500px">
            <notice-detail v-if="showNoticeDetail" :notice-id="currentNotice.noticeId"/>
        </el-drawer>
    </div>
</template>

<script>

import {getNoticeList} from "./api";
import {responseEnum} from "../../const/const";
import NoticeDetail from "./noticeDetail";
export default {
    components: {NoticeDetail},
    name:'noticeList',
    data() {
        return {
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
            },
            // 遮罩层
            loading: true,
            // 总条数
            total: 0,
            // 物料表格数据
            tableList: [],
            showNoticeDetail: false,
            currentNotice: null,
        };
    },
    created() {
        this.getList();
    },
    methods: {
        /** 查询列表 */
        getList() {
            this.loading = true;
            getNoticeList(this.queryParams).then(res => {
                if (res.code === responseEnum.success) {
                    this.tableList = res.rows || [];
                    this.total = res.total || 0;
                }
            }).finally(() => this.loading = false);
        },
        /**
         * 公告详情
         */
        onNoticeDetail(row) {
            this.currentNotice = row;
            this.showNoticeDetail = true;
        },

    }
};

</script>

<style lang="scss" scoped>

</style>
